﻿<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ko" lang="ko">
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	<meta http-equiv="X-UA-Compatible" content="IE=edge" />
	<meta http-equiv="Cache-Control" content="no-cache" />
	<meta http-equiv="Pragma" content="no-cache" /> 
	<meta http-equiv="Expires" content="0" />
	<title>부산은행 기획&amp;디자인</title>
	<link rel="stylesheet" type="text/css" href="/_pilot/css/cmn/plt/base.css" />
	<script type="text/javascript" src="/_pilot/cmn/js/include/plt/jquery-1.8.2.min.js"></script>
	<script type="text/javascript">
$.fn.setSnbMenu = function () {
	var depth1LI = $('>ul>li', this);
	var depth2UL = $('>ul', depth1LI);

	//첫 메뉴 선택
	var li = $('>ul>li:first', this);
	li.addClass('active');

	if ($('>ul', li).length > 0) {
		$('>ul', li).slideDown("fast");
		li = $('>ul>li:first', li);
		li.addClass('active');
		if ($('>ul', li).length > 0) {
			$('>ul', li).slideDown("fast");
			li = $('>ul>li:first', li);
			li.addClass('active');
		} else {
		}
	} else {
	}
	//첫 메뉴 선택

	$('a', this).click(function () {
		var li = $(this).parent();
		var sibling = li.siblings();

		sibling.removeClass('active');
		//$('li', sibling).removeClass('active');
		$('ul', sibling).slideUp("fast");
		li.addClass('active');

		var ul = $('>ul', li);
		if (ul.length > 0) {
			ul.slideToggle("fast", function () {
				//$('body').setLayout();
			});
			return false;
		} else if ($(this).attr('target') != '_blank') {
			//$('#loFrmContent').attr('src', $(this).attr('href') + '?timestamp=' + new Date().getTime());
			//return false;
		}
	});

};

$.fn.setLayout = function () {
	var leftWidth = $('#loIndexLeft', this).outerWidth();
	var headerHeight = $('#loIndexHeader', this).outerHeight();
	var windowWidth = $(window).outerWidth();
	var windowHeight = $(window).outerHeight();
	var frmWidth = windowWidth - leftWidth;
	var frmHeight = windowHeight - headerHeight;
	
	$('#loFrmContent', this).css({ width: frmWidth, height:frmHeight });
};


$(window).resize(function () {
	//$('body').setLayout();
});


$.fn.pageInit = function () {
	//$('body').setLayout();
	$('#loIndexLeft').setSnbMenu();
};


$(function () {
	$('html').pageInit();
});

	</script>
	<style type="text/css">
html {overflow-y:auto;}
body {width:199px;min-width:199px;}

/* header */
#loIndexHeader { width: 100%; height: 48px; border-bottom: 2px solid #3fa0ef; text-align:center;}
#loIndexHeader img { margin-top: 10px; }

/* snb */
#loIndexLeft { float: left; width:199px;font-size:12px;line-height:normal;}
#loIndexLeft ul {margin:0;padding:0;list-style:none;text-align:left;border:none;}
#loIndexLeft li {position:relative;margin:0;vertical-align:top;*zoom:1;border-right:none;}
#loIndexLeft li a {display:block;position:relative;padding:8px 10px;color:#666;font-weight:bold;text-decoration:none;background:#fff;border-bottom:1px solid #e1e6ec;*zoom:1}
#loIndexLeft li a .i {position:absolute;top:50%;left:100%;width:8px;height:8px;margin:-4px 0 0 -16px;color:#ccc;background:url(/_guide/img/ico_sub.gif) no-repeat left top;text-indent:-2000px;}
#loIndexLeft li ul {padding:5px 0;background:#fff;display:none;border-top:none;}
#loIndexLeft li li {margin:0;border:none;}
#loIndexLeft li li a {padding:5px 10px;border:none;background:#fff;font-weight:normal}
#loIndexLeft li li a span {color:#666}
#loIndexLeft li.active {z-index:2;border:1px solid #83c2f7;width:197px;}
#loIndexLeft li li.active {border:none}
#loIndexLeft li.active a {border:none;color:#000}
#loIndexLeft li.active .i {background-position:0 -44px}
#loIndexLeft li.active li a {border:none}
#loIndexLeft li.active ul {border-top:1px solid #eee}
#loIndexLeft li.active li.active a span {font-weight:bold;color:#369ae8;}
#loIndexLeft li li li { margin-left: 15px; }
#loIndexLeft li.active li.active li a span { font-size: 11px; color:#666;font-weight:normal;}
#loIndexLeft li.active li.active li.active a span { font-weight:bold;}


/* frame */
#loFrmContent { border: none; float: left; }

	</style>
</head>
<body>
	<div id="loIndexLeft" class="guide-snb-menu">
		<ul>
			<!-- <li><a href="info.html" target="loFrmContent"><span>프로젝트 기본정보</span></a></li> -->
			<li><a href="#left100"><span>HTML 코딩가이드</span><span class="i">&gt;</span></a>
				<ul id="left100">
					<li><a href="coding/naming.html" target="loFrmContent"><span>폴더구조 및 명명규칙</span></a></li>
					<li><a href="coding/html_code.html" target="loFrmContent"><span>HTML 코드 작성 규칙</span></a></li>
					<li><a href="coding/html_element.html" target="loFrmContent"><span>HTML 엘리먼트 작성 규칙</span></a></li>
					<li><a href="coding/css.html" target="loFrmContent"><span>CSS 코드 작성 규칙</span></a></li>
					<li><a href="coding/image.html" target="loFrmContent"><span>이미지 가이드</span></a></li>
					<li><a href="coding/check_list.html" target="loFrmContent"><span>접근성 가이드</span></a></li>
					
				</ul>
			</li>
			<li><a href="#leftL201"><span>레이아웃</span><span class="i">&gt;</span></a>
				<ul id="leftL201">
					<li><a href="/cmn/jsp/include/html/layout.html" target="loFrmContent"><span>Layout ALL</span></a></li>
				</ul>
			</li>
			<li><a href="#leftL202"><span>HTML 패턴 (For 퍼블팀)</span><span class="i">&gt;</span></a>
				<ul id="leftL202">
					<li><a href="template/button.html" target="loFrmContent"><span>Button</span></a></li>
					<li><a href="template/form.html" target="loFrmContent"><span>Form</span></a></li>
					<li><a href="template/table.html" target="loFrmContent"><span>Table</span></a></li>
					<li><a href="template/tab.html" target="loFrmContent"><span>Tab</span></a></li>
					<li><a href="template/step.html" target="loFrmContent"><span>Step</span></a></li>
					<li><a href="template/boardA.html" target="loFrmContent"><span>Board A,B</span></a></li>
					<li><a href="template/boardC.html" target="loFrmContent"><span>Board C</span></a></li>
					<li><a href="template/boardD.html" target="loFrmContent"><span>Board D</span></a></li>
					<li><a href="template/board_comment.html" target="loFrmContent"><span>Board Comment</span></a></li>
					<li><a href="template/board_faq.html" target="loFrmContent"><span>Board FAQ</span></a></li>
					<li><a href="template/contents.html" target="loFrmContent"><span>Contents</span></a></li>
					<li><a href="template/agree.html" target="loFrmContent"><span>Agree Form</span></a></li>
				</ul>
			</li>
			<li><a href="#leftL203"><span>Busan UI (For 개발,퍼블팀)</span><span class="i">&gt;</span></a>
				<ul id="leftL203">
					<li><a href="bsui/layerpopup.html" target="loFrmContent"><span>Layer Popup</span></a></li>
					<li><a href="bsui/tab.html" target="loFrmContent"><span>Tab</span></a></li>
					<li><a href="bsui/accordion.html" target="loFrmContent"><span>Accordion</span></a></li>
					<li><a href="bsui/rolling.html" target="loFrmContent"><span>Rolling Banner</span></a></li>
					<li><a href="bsui/rolling2.html" target="loFrmContent"><span>Rolling Banner2</span></a></li>
					<li><a href="bsui/placeholder.html" target="loFrmContent"><span>Input Placeholder</span></a></li>
					<li><a href="bsui/datepicker.html" target="loFrmContent"><span>Datepicker</span></a></li>
					<li><a href="bsui/slider.html" target="loFrmContent"><span>Slider</span></a></li>
				</ul>
			</li>
			<li><a href="http://busanbank.jtree12.com:8888/hps/" target="_blank" title="새창"><span>기획/디자인/퍼블리싱 진척관리</span></a></li>
		</ul>
	</div>
</body>
</html>
